I've got an array of different sized images. I want to place these images on a canvas in a sort of automated collage. Does anyone have an idea of how to work the logic behind this concept?

All my images have heights divisible by 36 pixels and widths divisible by 9 pixels. They have mouseDown functions that allow you to drag and drop. When dropped the image goes to the closest x point divisible by 9 and y point divisble by 36. There is a grid drawn on top of the canvas.

I've sorted the array of images based on height, then based on their widths.

imagesArray.sortOn("height", Array.NUMERIC | Array.DESCENDING); imagesArray.sortOn("width", Array.NUMERIC | Array.DESCENDING);

I'd like to take the largest image ( imageArray[0] ) to put in corner x,y = 0,0. Then randomize the rest of the images and fit them into the collage canvas.